import {createContext, useState} from "react";
import CounterClass from "./01-hooks初体验/counterClass";
import CounterHooks from "./01-hooks初体验/counterHooks";
import MultiHookState from "./02-useState的使用/MultiHookState";
import ClassCounterTitleChange from "./03-useEffect的使用/01-class实现title的修改";
import HookCounterChange from "./03-useEffect的使用/02-hook实现titile的修改";
import EffectHookCancelDemo from "./03-useEffect的使用/03-useEffect模拟订阅和取消";
import MultiEffectHook from "./03-useEffect的使用/04-使用多个useEffect";
import ContextHookDemo from "./04-useContext/01-useContext的使用";
import Home from "./05-useReducer的使用/home";
import Profile from "./05-useReducer的使用/profile"
import CallbackHookDemo01 from "./06-useCallback的使用/01-useCallback不能进行的性能优化";
import CallbackHookDemo02 from "./06-useCallback的使用/02-useCallback进行的性能优化";
import MenuHookDemo01 from "./07-useMemo的使用/01-useMemo复杂计算的应用";
import MemoHookDemo02 from "./07-useMemo的使用/02-useMemo传入子组件应用类型";
import RefHookDemo01 from "./08-useRef/01-useRef引用DOM";
import RefHookDemo02 from "./08-useRef/02-useRef引用其它数据";
import ForwardRefDemo from "./09-useImperativeHandle/01-回顾forwardRef的用法";
import ImperativeHookDemo from "./09-useImperativeHandle/02-useImperativeHandle";
import EffectCountDemo from "./10-useLayoutEffect/01-useEffect的counter修改";
import EffectLayoutCountDemo from "./10-useLayoutEffect/02-useEffectLayout的counter修改";
import CustomLifeHookDemo from "./11-自定义Hook/01-认识自定义Hook";
import CustomContextShareHook from "./11-自定义Hook/02-自定义Hook练习-Context共享";
import CustomScrollPositionHook from "./11-自定义Hook/03-自定义Hook练习-获取滚动位置";
import CustomDataStoreHook from "./11-自定义Hook/04-自定义Hook练习-localStorage存储";

export const UserContext = createContext();
export const ThemeContext = createContext();
export const TokenContext = createContext()
function App() {
    const [show, setShow] = useState(true)
    return (
        <div className="App">
            {/*<CounterClass/>*/}
            {/*<br/>*/}
            {/*<CounterHooks/>*/}
            {/*<br/>*/}
            {/*<MultiHookState/>*/}
            {/*<br/>*/}
            {/*<ClassCounterTitleChange/>*/}
            {/*<br/>*/}
            {/*<HookCounterChange/>*/}
            {/*<br/>*/}
            {/*{show && <EffectHookCancelDemo/>}*/}
            {/*<button onClick={event => setShow(!show)}>切换</button>*/}
            {/*<br/>*/}
            {/*{show && <MultiEffectHook/>}*/}
            {/*<button onClick={event => setShow(!show)}>切换</button>*/}
            {/*<br/>*/}
            {/*<UserContext.Provider value={{name: "lisense", age: 18}}>*/}
            {/*    <ThemeContext.Provider value={{fontSize: "30px", color: "red"}}>*/}
            {/*        <ContextHookDemo/>*/}
            {/*    </ThemeContext.Provider>*/}
            {/*</UserContext.Provider>*/}
            {/*<br/>*/}
            {/*<Home/>*/}
            {/*<Profile/>*/}
            {/*<br/>*/}
            {/*<CallbackHookDemo01/>*/}
            {/*<br/>*/}
            {/*<CallbackHookDemo02/>*/}
            {/*<br/>*/}
            {/*<MenuHookDemo01/>*/}
            {/*<br/>*/}
            {/*<MemoHookDemo02/>*/}
            {/*<br/>*/}
            {/*<RefHookDemo01/>*/}
            {/*<br/>*/}
            {/*<RefHookDemo02/>*/}
            {/*<br/>*/}
            {/*<ForwardRefDemo/>*/}
            {/*<br/>*/}
            {/*<ImperativeHookDemo/>*/}
            {/*<br/>*/}
            {/*<EffectCountDemo/>*/}
            {/*<br/>*/}
            {/*<EffectLayoutCountDemo/>*/}
            {/*<br/>*/}
            {/*{show && <CustomLifeHookDemo/>}*/}
            {/*<button onClick={event => setShow(!show)}>切换</button>*/}
            {/*<UserContext.Provider value={{name: "lisense", age: 18}}>*/}
            {/*    <TokenContext.Provider value={{username: "admin", password: "123456"}}>*/}
            {/*        <CustomContextShareHook/>*/}
            {/*    </TokenContext.Provider>*/}
            {/*</UserContext.Provider>*/}
            {/*<br/>*/}
            {/*<CustomScrollPositionHook/>*/}
            <br/>
            <CustomDataStoreHook/>
        </div>
    );
}

export default App;
